<template>
    <div class="common-layout">
      <el-container>
        <el-header class="lxheader">立讯酒店管理系统</el-header>
        <el-container class="mymain">
          <el-aside width="200px" class="lxaside">
            <!--左侧菜单-->
            <el-menu
                    default-active="1"
                    class="el-menu-vertical-demo" collapse-transition="true">
              <el-sub-menu index="1">
                    <template #title>
                    <span>酒店管理</span>
                    </template>
                    <el-menu-item-group>
                        <el-menu-item index="1-1">
                          <router-link to="/sysuser">用户管理</router-link>
                        </el-menu-item>
                        <el-menu-item index="1-2">
                          <router-link to="/room">客房管理</router-link>
                        </el-menu-item>
                        <el-menu-item index="1-3">
                          <router-link to="/reservation">预订管理</router-link>
                        </el-menu-item>
                        <el-menu-item index="1-4">
                          <router-link to="/discountactivities">折扣管理</router-link>
                        </el-menu-item>
                        <el-menu-item index="1-5">
                          <router-link to="/discountactivities">入住维护</router-link>
                        </el-menu-item>
                    </el-menu-item-group>
              </el-sub-menu>
            </el-menu>
           <!-- /左侧菜单-->
          </el-aside>
          <el-container>
            <el-main class="lxmain"> 
                <!-- 嵌套视图 -->
                <router-view class="view mainView"></router-view>
            </el-main>
            <el-footer class="lxfooter">技术支持@20人工智能2班</el-footer>
          </el-container>
        </el-container>
      </el-container>
    </div>
  </template>

<style>

    .common-layout{
        width: 100%;
       
        border: 1px solid blue;
    }

    .mymain{
        height:900px;
        border: 1px solid red;
    }

   .lxheader{
     border: 1px solid blue;
     font-size: 24px;
   }

   .lxaside{
     border: 1px solid yellow;
     height: 100%;
   }

   .lxmain{
     border: 1px solid red;
   }

   .lxfooter{
     border: 1px solid green;
     text-align: right;
   }

   

</style>